<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>  
<!DOCTYPE html>  
<html>  
<head>  
    <meta charset="UTF-8">  
    <title>点餐小程序</title>  
    <!-- 这里可以引入CSS样式文件 -->  
    <style>  
  /* CSS样式 */  
  body {  
    font-family: Arial, sans-serif;  
    margin: 0;  
    padding: 0;  
  }  
  
  .navbar {  
    display: flex;  
    justify-content: space-between;  
    align-items: center;  
    background-color: #333;  
    color: #fff;  
    padding: 10px;  
  }  
  
  .navbar a {  
    color: #fff;  
    text-decoration: none;  
    padding: 10px;  
    margin: 0 5px;  
    border-radius: 5px;  
    transition: background-color 0.3s ease;  
  }  
  
  .navbar a:hover {  
    background-color: #555;  
  }  
  
  .navbar .cart-icon {  
    font-size: 1.5em; /* 假设你使用了一个购物车图标字体或图标库 */  
  }  
  
  .navbar .user-icon {  
    font-size: 1.5em; /* 假设你使用了一个用户图标字体或图标库 */  
  }  
      /* 自定义样式 */  
    .menu-item {  
        margin-bottom: 20px;  
        border-bottom: 1px solid #ddd;  
        padding-bottom: 20px;  
    }  
    .menu-item:last-child {  
        border-bottom: none;  
    }  
    .menu-item img {  
        max-width: 100%;  
        height: auto;  
        margin-bottom: 10px;  
    } 
</style>
    <link rel="stylesheet" href="styles.css">  
</head>  
<body>  
    <header>  
        <h1>欢迎光临</h1>  
        <div class="navbar">  
          <a href="menu.jsp">菜单</a>  
          <a href="cart.jsp" class="cart-icon">🛒</a> <!-- 使用购物车图标代替文本 -->  
          <a href="profile.jsp" class="user-icon">👤</a> <!-- 使用用户图标代替文本 -->  
</div>  
        <!-- 可以在这里添加导航栏、登录/注册链接等 -->  
    </header>  
  
    <main>  
       <div class="restaurant-info">  
        <h2>餐馆名称</h2>  
        <p>美味轩</p>  
  
        <h2>地址</h2>  
        <p>美食街123号</p>  
  
        <h2>营业时间</h2>  
        <p>周一至周日，10:00-22:00</p>  
  
        <h2>联系方式</h2>  
        <p>电话: 123-456-7890</p>  
        <p>邮箱: [info@deliciousrestaurant.com](mailto:info@deliciousrestaurant.com)</p>  
  
        <h2>餐馆图片</h2>  
        <img src="path-to-restaurant-image.jpg" alt="餐馆图片">  
    </div> 
    </main>  
  
    <footer>  
        <p>版权信息...</p>  
    </footer>  
  
    <!-- 引入JavaScript文件，用于实现前端交互功能 -->  
    <script src="scripts.jsp"></script>  
</body>  
</html>